
    <!-- Title area -->
    <div class="titleArea">
        <div class="wrapper">
            <div class="pageTitle">
                <h1><img src="<?php echo base_url()?>application/views/admin/images/icons/control/32/pencil.png" />&nbsp;&nbsp;Edit Facility</h1>
            </div>

            <div class="clear"></div>
        </div>
    </div>
    
    <div class="line"></div>
    
    <!-- Main content wrapper -->
    <div class="wrapper">
        
        <!-- Form -->
        <form action="<?php echo site_url()?>admin/c_facility/update" method="post" class="form" id="validate">
            <fieldset>
            	<input type="hidden" name="id" value="<?php echo $facility['id']?>"  />
                <div class="formRow">
                    <label>Name:<span class="req">*</span></label>
                    <div class="formRight"><input type="text" name="name" id="name" class="validate[required]" value="<?php echo $facility['name'];?>" autocomplete="on" /></div>
                    <div class="clear"></div>
                </div>
                <div class="formRow">
                    <label>Description:<span class="req">*</span></label>
                    <div class="formRight">
                        <textarea  name="description" rows="" id="editor" cols="100" rows="100" class="validate[required]"><?php echo $facility['description'];?></textarea>
                    </div>
                    <div class="clear"></div>
                </div>    
                
               <div class="formRow">
					<label>Icon<span class="req">*</span></label>
                    <div class="formRight">
                        <!-- image  -->
                        <div id="view_picture_eng" style="border:#CCC 1px solid; padding:2px; width:100%; text-align:center; cursor:pointer;"><img src="<?php echo base_url()?>upload/facility/<?php echo $facility['icon']?>"  align="<?php echo $facility['icon']?>" height="28" width="30"/></div>
                        <!--<button onclick="getFile();" id="upload" type="button" >Upload</button>-->
                        <input type="button" value="Upload" id="upload" onclick="getFile('image_eng_file','view_picture_eng','file_name_eng','image_eng');"/>
                        <input type="button" value="Delete" onclick="delete_file('image_eng_file','view_picture_eng','file_name_eng','image_eng');"/>
                        
                        <input id="image_eng_file" name="image_eng_file"  type="file" style="display:none;" />
                        <input type="hidden" name="image_eng" id="image_eng" value="<?php echo $facility['icon'];?>"/>
                        <label id="file_name_eng">Pleas upload!</label>
                    </div>
                    
                    <div class="clear"></div>
                </div>
                
                <div class="formRow">
					<label>Image<span class="req">*</span></label>
                    <div class="formRight">
                        <!-- image  -->
                        <div id="view_picture_fr" style="border:#CCC 1px solid; padding:2px; width:100%; text-align:center; cursor:pointer;"><img src="<?php echo base_url()?>upload/facility/<?php echo $facility['image']?>"  align="<?php echo $facility['image']?>" height="77" width="140"/></div>
                        <!--<button onclick="getFile();" id="upload" type="button" >Upload</button>-->
                        <input type="button" value="Upload" id="upload" onclick="getFile('image_fr_file','view_picture_fr','file_name_fr','image_fr');"/>
                        <input type="button" value="Delete" onclick="delete_file('image_fr_file','view_picture_fr','file_name_fr','image_fr');"/>
                        
                        <input id="image_fr_file" name="image_fr_file"  type="file" style="display:none;" />
                        <input type="hidden" name="image_fr" id="image_fr" value="<?php echo $facility['image'];?>"/>
                        <label id="file_name_fr">Pleas upload!</label>
                    </div>
                    
                    <div class="clear"></div>
                </div>
            </fieldset>
            <div class="wizButtons"> 
                <div class="status" id="status1"></div>
                <span class="wNavButtons">
                    <input class="basic" id="back1" value="Back" type="button" onclick="window.location = '<?php echo site_url()?>admin/c_facility/';" />
                    <input class="blueB ml10" id="next1" value="Save" type="submit" />
                </span>
            </div>
            <div class="clear"></div>
        </form>

    </div>
	
    <script type="application/javascript">
	/**
	 * Load window brows file
	 */
	function getFile(_file,view_picture,file_name,picture)
	{
		document.getElementById(_file).click();
		upload(_file,view_picture,file_name,picture);
	}// function
	
	function upload(_file,view_picture,file_name,picture){
		
	  var input = document.getElementById(_file), 
		  formdata = false;
	  if (window.FormData) {
		  formdata = new FormData();
	  }
	 
		  input.addEventListener("change", function (evt) {
			  document.getElementById(file_name).innerHTML = "Uploading . . ."
			  var i = 0, len = this.files.length, img, reader, file;
			  
			  for ( ; i < len; i++ ) {
				  file = this.files[i];
		  
					  if ( window.FileReader ) {
						  reader = new FileReader();
						  reader.onloadend = function (e) { 
							  showUploadedItem(e.target.result, file.fileName);
						  };
						  reader.readAsDataURL(file);
					  }
					  if (formdata) {
						  formdata.append(_file, file);
					  }
			  }

			  if (formdata) {
				  jQuery.ajax({
					  url: "<?php echo site_url();?>admin/c_file/upload_file/facility/" + _file,
					  type: "POST",
					  data: formdata,
					  processData: false,
					  contentType: false,
					  success: function (res) {
						  document.getElementById(view_picture).innerHTML = '<img width="30%" src="<?= base_url().'upload/facility/' ?>'+res+'" />';
						  document.getElementById(file_name).innerHTML = res; 
						  document.getElementById(picture).value = res; 
						  formdata = new FormData();//clear the old file that remember
					  }
				  });
			  }
		  }, false);
	}
	
//		delete file
//		
		function delete_file(file,view_picture,file_name,picture){
			var result = confirm("Are you sure you want to delete?");
			if (result == true) {	
			  $.ajax({
				   type: "POST",
				   url: "<?php echo site_url();?>admin/c_file/delete_file/facility/" + picture,
				   data: '', // paramenter & value
				   cache: false,
				   success: function(){
					document.getElementById(view_picture).innerHTML = '';
					document.getElementById(file_name).innerHTML = "Please upload document file!"; 
					document.getElementById(picture).value = ""; 
					document.getElementById(file).value = "";
				  }
				 
				 });
			 } 
		}
	</script>